<template>
	<view class="msg-prompt-page" :style="msgConStyle">
		<image class="msg-prompt-page__icon" :src="noPic" :style="iconStyle" mode="aspectFill"></image>
		<view class="msg-prompt-page__txt">{{noMsg}}</view>
		<view class="msg-prompt-page__handle" @click="onClick" v-if="showHande">{{handeTxt}}</view>
	</view>
</template>

<script>
	export default {
		name:'stEmptyMsg',
		props: {
			noPic: {
				type: String,
				default: 'https://static.member.stourweb.cn/uniapp/static/images/empty-msg.png'
			},
			iconStyle: {
				type: Object,
				default (){
					return {}
				}
			},
			msgConStyle: {
				type: Object,
				default (){
					return {}
				}
			},
			noMsg: {
				type: String,
				default: '没有相关数据'
			},
			handeTxt: {
				type: String,
				default: ''
			},
			showHande:{
				type: Boolean,
				default: true
			}
		},
		data() {
			return {
			
			}
		},
		methods: {
			onClick(e){
				this.$emit('onClick', e)
			}
		}
	}
</script>

<style lang="scss" scoped>
	.msg-prompt-page{
		padding: 120rpx 0;
		text-align: center;
		&__icon{
			width: 158rpx;
			height: 158rpx;
		}
		&__txt{
			text-align: center;
			font-size: $uni-font-size-base;
			color:$uni-text-color-grey;
			padding: 20rpx 0 60rpx;
		}
		&__handle{
			color: $uni-text-color-inverse;
			display: inline-block;
			padding: 20rpx 60rpx;
			border-radius: $uni-border-radius-lg;
			font-size: $uni-font-size-base;
			background-color: $uni-bg-color-primary;
		}
	}
</style>
